{template 'tpl_header'}

<div class="weui-search-bar" id="searchBar">
    <form class="weui-search-bar__form">
        <div class="weui-search-bar__box">
            <i class="weui-icon-search"></i>
            <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required="">
            <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
        </div>
        <label class="weui-search-bar__label" id="searchText"
               style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);">
            <i class="weui-icon-search"></i>
            <span>搜索</span>
        </label>
    </form>
    <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
</div>
<div class="swiper-container">
    <div class="swiper-wrapper">
        {loop $dest['thumbs'] $thumbs}
        <div class="swiper-slide">
            <img src="{php echo tomedia($thumbs)}"/>
        </div>
        {/loop}
    </div>
    <div class="swiper-pagination"></div>
</div>

<div class="btn_space_area">
    <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary">单品 ( {$dest['single_number']} )</a>
    <a href="{php echo url('entry', array('m' => 'vj_bontrip','do' => 'oneday','id' => $id),true); }"
       class="weui-btn weui-btn_mini weui-btn_default">一日游 ( {$dest['oneday_number']} )</a>
    <a href="{php echo url('entry', array('m' => 'vj_bontrip','do' => 'quality','id' => $id),true); }"
       class="weui-btn weui-btn_mini weui-btn_default">精品游 ( {$dest['quality_number']} )</a>
</div>
{if !empty($single) }
{loop $single_list $singles}
<div class="weui-flex weui-flex__col2">
    {loop $singles $single}
    {if !empty($single) }
    <a href="{php echo url('entry', array('m' => 'vj_bontrip','do' => 'goods','id' => $single['id'],'type' => 'single'),true);}"
       class="weui-flex__item weui-flex__col2__style2">
        <img src="{php echo tomedia($single['thumb'])}">
        <div class="weui-flex__col2__style2__place">
            <span>{$single['name']}</span>
        </div>
        <div class="weui-flex__col2__style2__title">
            <span>{$single['remark']}</span>
        </div>
        <div class="weui-flex__col2__style2__price">
            <span>¥{php echo round($single['adult_price']*$single['exchange_rate'])}／人起</span>
        </div>
    </a>
    {else}
    <a href="javascript:;" style="background-color: #f8f8f8;" class="weui-flex__item weui-flex__col2__style2">
    </a>
    {/if}
    {/loop}
</div>
{/loop}
{else}
<div id="list_null" class="weui-loadmore weui-loadmore_line">
    <span class="weui-loadmore__tips">暂无数据</span>
</div>
{/if}
<div id="loading" class="weui-loadmore">
    <i class="weui-loading"></i>
    <span class="weui-loadmore__tips">正在加载</span>
</div>


<div class="weui-whitespace weui-whitespace__xl"></div>


{template 'tpl_footer'}

<script src="{MOBILE_RES}js/swiper.min.js"></script>
<script>
    $('#loading').hide();
    var single_page = 2;
    var single_is_next = '{$is_next}';
    var dest_id = '{$id}';
    $(function () {
        $(".swiper-container").swiper({
            loop: true,
            autoplay: 3000
        });
        $(document).scroll(function () {
            //当滚动条到底部时请求数据
            if ($('body').scrollHeight() - $('body').height() - 3 <= $(window).scrollTop()) {
                if (single_is_next == '1') {
                    //防止重复请求
                    single_is_next = '0';
                    $('#loading').show();
                    var data = {
                        'action': 'single_list',
                        'page': single_page,
                        'dest_id': dest_id,
                    };
                    $.ajax({
                        url: "{php echo $this->createMobileUrl('ajax')}",
                        type: 'post',
                        data: data,
                        dataType: 'json',
                        success: function (res) {
                            if (res.status == 1) {
                                single_is_next = (res.data.is_next) ? '1' : '0';
                                console.log(res.data.list);
                                add_single(res.data.list);
                                $('#loading').hide();
                                single_page++;
                            } else {
                                $.toast(res.msg, "cancel");
                            }

                        },
                        error: function (res) {
                            $.toast('请求失败，请检测网络或联系客服', "cancel");
                        }
                    });
                }
            }
        });
        $('.weui-search-bar__form').submit(function (event) {
            event.preventDefault();
            var url = "{php echo url('entry', array('m' => 'vj_bontrip','do' => 'single','id' => $id),true); }";
            window.location.href = url + "&search=" + $('#searchInput').val();
        });
    });


    function add_single(list) {
        var html = '';
        for (li in list) {
            html += '<div class="weui-flex weui-flex__col2">\n';
            for (single in list[li]) {
                if (list[li][single] == null) {
                    html += '<a href="javascript:;" style="background-color: #f8f8f8;" class="weui-flex__item weui-flex__col2__style2">\n' +
                        '    </a>';
                } else {
                    var url = "{php echo url('entry', array('m' => 'vj_bontrip','do' => 'goods','type' => 'single'),true);}";
                    url += "&id=" + list[li][single].id;
                    html += '<a href="' + url + '" class="weui-flex__item weui-flex__col2__style2">\n' +
                        '        <img src="' + list[li][single].thumb + '">\n' +
                        '        <div class="weui-flex__col2__style2__place">\n' +
                        '            <span>' + list[li][single].name + '</span>\n' +
                        '        </div>\n' +
                        '        <div class="weui-flex__col2__style2__title">\n' +
                        '            <span>' + list[li][single].remark + '</span>\n' +
                        '        </div>\n' +
                        '        <div class="weui-flex__col2__style2__price">\n' +
                        '            <span>¥' + list[li][single].adult_price + '／人起</span>\n' +
                        '        </div>\n' +
                        '    </a>';
                }
            }
            html += '</div>';
        }
        $('#loading').before(html);
    }
</script>